const MAX_TRY = 6
const WORD_LENGTH = 5
const ALPHABET_SIZE = 26
const ALPHABET_START = 65

const THEME_STYLESHEET = document.getElementById('themeStylesheet')
const SYMBOL_MODE_STYLESHEET = document.getElementById('symbolModeStylesheet')

const WIN_LABEL = document.getElementById('winLabel')
const LOSE_LABEL = document.getElementById('loseLabel')
const WIN_RATE_LABEL = document.getElementById('winRateLabel')
const AVG_ATTEMPT_LABEL = document.getElementById('avgAttemptLabel')
const GUESS_STAT_TABLE = document.getElementById('guessStatTable')

const MID_PANEL = document.getElementById('midPanel')

const RESTART_BUTTON = document.getElementById('restartButton')
const THEME_BUTTON = document.getElementById('themeButton')
const SYMBOL_MODE_BUTTON = document.getElementById('symbolModeButton')
const DIFFICULT_MODE_BUTTON = document.getElementById('difficultModeButton')

const RESET_STAT_BUTTON = document.getElementById('resetStatButton')
const RESET_CONFIG_BUTTON = document.getElementById('resetConfigButton')

// read game state and config from array
let state_str = undefined
let config_str = undefined
document.cookie.split(";").forEach(function (cookie) {
	if (cookie.indexOf('state=') != -1)
		state_str = cookie.substring(cookie.indexOf('state=') + 6)
	else if (cookie.indexOf('config=') != -1)
		config_str = cookie.substring(cookie.indexOf('config=') + 7)
})

// interface of game state and config
function has_state() {
	return state_str !== undefined
}
function get_state_str() {
	return state_str
}
function put_state_str(str) {
	document.cookie = 'state=' + str + ';expires=Fri, 31 Dec 9999 23:59:59 GMT'
}
function has_config() {
	return config_str !== undefined
}
function get_config_str() {
	return config_str
}
function put_config_str(str) {
	document.cookie = 'config=' + str + ';expires=Fri, 31 Dec 9999 23:59:59 GMT'
}

// interface of statistics
function put_stat(win, lose, total_attempt) {
	WIN_LABEL.innerText = win.toString()
	LOSE_LABEL.innerText = lose.toString()
	WIN_RATE_LABEL.innerText = (win | lose) ? (win * 100. / (win + lose)).toFixed(2) + '%' : 'N/A'
	AVG_ATTEMPT_LABEL.innerText = win ? (total_attempt / win).toFixed(2) : 'N/A'
}

// interface of guess statistics table
let guessItems
function clear_guess_table() {
	guessItems = 0
	GUESS_STAT_TABLE.innerHTML = ''
}
function add_guess_item(guess, cnt) {
	++guessItems

	let tableRowElement = document.createElement('tr')

	let tableRankElement = document.createElement('td')
	tableRankElement.innerHTML = guessItems.toString()
	tableRowElement.appendChild(tableRankElement)

	let tableGuessElement = document.createElement('td')
	tableGuessElement.innerHTML = guess
	tableRowElement.appendChild(tableGuessElement)

	let tableCountElement = document.createElement('td')
	tableCountElement.innerHTML = cnt.toString()
	tableRowElement.appendChild(tableCountElement)

	GUESS_STAT_TABLE.appendChild(tableRowElement)
}

// create guess table
let letterGrid = new Array(MAX_TRY + 1)
for (let i = 0; i <= MAX_TRY; ++i) {
	if (i == MAX_TRY) {
		let divider = document.createElement('p')
		divider.style.margin = '0'
		divider.innerText = '答案：'
		MID_PANEL.append(divider)
	}
	let letterRow = new Array(WORD_LENGTH)
	let letterRowElement = document.createElement('div')
	letterRowElement.className = 'row'
	for (let j = 0; j < WORD_LENGTH; ++j) {
		let letterElement = document.createElement('div')
		letterElement.className = 'letter disabled'
		letterRow[j] = letterElement
		letterRowElement.appendChild(letterElement)
	}
	letterGrid[i] = letterRow
	MID_PANEL.append(letterRowElement)
}

// guess table interface
function set_letter_content(i, j, str) {
	letterGrid[i][j].innerHTML = str
}
function set_letter_style(i, j, style) {
	switch (style) {
		case 0:
			letterGrid[i][j].className = 'letter disabled'
			break
		case 1:
			letterGrid[i][j].className = 'letter'
			break
		case 2:
			letterGrid[i][j].className = 'letter toomany'
			break
		case 3:
			letterGrid[i][j].className = 'letter misplaced'
			break
		case 4:
			letterGrid[i][j].className = 'letter correct'
			break
	}
}

// create keyboard buttons
var letterButtonArray = new Array(ALPHABET_SIZE)
for (let i = 0; i < ALPHABET_SIZE; ++i) {
	let letterButton = document.createElement('button')
	letterButton.className = 'keyboard'
	letterButton.innerText = String.fromCharCode(i + ALPHABET_START)
	letterButtonArray[i] = letterButton
}
function addLetterButton(elem, chr) {
	elem.appendChild(letterButtonArray[chr.charCodeAt(0) - ALPHABET_START])
}
function set_letter_button_style(i, style) {
	switch (style) {
		case 0:
			letterButtonArray[i].className = 'keyboard disabled'
			break
		case 1:
			letterButtonArray[i].className = 'keyboard'
			break
		case 2:
			letterButtonArray[i].className = 'keyboard toomany'
			break
		case 3:
			letterButtonArray[i].className = 'keyboard misplaced'
			break
		case 4:
			letterButtonArray[i].className = 'keyboard correct'
			break
	}
}

var enterButton = document.createElement('button')
enterButton.className = 'keyboard'
enterButton.innerText = '⮐'

var backspaceButton = document.createElement('button')
backspaceButton.className = 'keyboard'
backspaceButton.style.paddingTop = '12px'
backspaceButton.style.fontSize = '26px'
backspaceButton.innerText = '⌫'

// create keyboard table
let keyboardRow0 = document.createElement('div')
keyboardRow0.className = 'row'

addLetterButton(keyboardRow0, 'Q')
addLetterButton(keyboardRow0, 'W')
addLetterButton(keyboardRow0, 'E')
addLetterButton(keyboardRow0, 'R')
addLetterButton(keyboardRow0, 'T')

addLetterButton(keyboardRow0, 'Y')
addLetterButton(keyboardRow0, 'U')
addLetterButton(keyboardRow0, 'I')
addLetterButton(keyboardRow0, 'O')
addLetterButton(keyboardRow0, 'P')

MID_PANEL.append(keyboardRow0)

let keyboardRow1 = document.createElement('div')
keyboardRow1.className = 'row'

addLetterButton(keyboardRow1, 'A')
addLetterButton(keyboardRow1, 'S')
addLetterButton(keyboardRow1, 'D')
addLetterButton(keyboardRow1, 'F')
addLetterButton(keyboardRow1, 'G')

addLetterButton(keyboardRow1, 'H')
addLetterButton(keyboardRow1, 'J')
addLetterButton(keyboardRow1, 'K')
addLetterButton(keyboardRow1, 'L')

MID_PANEL.append(keyboardRow1)

let keyboardRow2 = document.createElement('div')
keyboardRow2.className = 'row'

keyboardRow2.appendChild(enterButton)
addLetterButton(keyboardRow2, 'Z')
addLetterButton(keyboardRow2, 'X')
addLetterButton(keyboardRow2, 'C')
addLetterButton(keyboardRow2, 'V')

addLetterButton(keyboardRow2, 'B')
addLetterButton(keyboardRow2, 'N')
addLetterButton(keyboardRow2, 'M')
keyboardRow2.appendChild(backspaceButton)

MID_PANEL.append(keyboardRow2)

// game start and end interface
function set_game_start() {
	RESTART_BUTTON.setAttribute('disabled', '')
	RESET_STAT_BUTTON.setAttribute('disabled', '')
	RESET_CONFIG_BUTTON.setAttribute('disabled', '')
}
function set_game_end() {
	RESTART_BUTTON.removeAttribute('disabled')
	RESET_STAT_BUTTON.removeAttribute('disabled')
	RESET_CONFIG_BUTTON.removeAttribute('disabled')
}

// message interface
function msg(str) {
	alert(str)
}